<template>
  <div class="image_wrap">
    <div class="image">
      <img :src="config.url" :style="styleObject" alt="">
    </div>
  </div>
</template>

<script>
export default {
  name: 'ImageChart',
  components: {},
  props: {},
  data () {
    return {
      config: {
        url: "https://t7.baidu.com/it/u=1956604245,3662848045&fm=193&f=GIF",
        width: 300,
        height: 200,
        x: 300,
        y: 0,
      }
    }
  },
  computed: {
    styleObject() {
      return {
        width: `${this.config.width}px`, 
        height: `${this.config.height}px`, 
        transform: `translate(${this.config.x}px,${this.config.y}px)`,
      };
    }
  },
  watch: {},
  created () {},
  mounted () {},
  methods: {}
}
</script>

<style scoped lang="scss"></style>
